<template>
  <div class="body">
    <div class="body_left">
      <BaseMenu
        :menuList="bodyLeft"
        :chidrenShow="chidrenShow"
        :chidrenShowTwo="chidrenShowTwo"
        @go="go"
      />
    </div>
    <div class="body_right">
      <!-- <el-card> -->
      <router-view></router-view>
      <!-- </el-card> -->
    </div>
  </div>
</template>

<script>
import BaseMenu from '@/components/baseMenu/baseMenu'

export default {
  name: 'index',
  components: {
    BaseMenu
  },
  data() {
    return {
      bodyLeft: [
        {
          path: '',
          title: '土地看板',
          icon: 'zhtd-tdkb',
          id: 471,
          children: [
            {
              path: '/wisdomLand/SitePlanManagement/SitePlanBoard',
              title: '供地计划看板',
              id: 4711,
              icon: 'zhtd-gdjhkb'
            },
            {
              path: '/wisdomLand/wisdomLandOverview',
              title: '土地看板',
              id: 4712,
              icon: 'zhtd-tdkb1'
            }
          ]
        },
        {
          path: '/wisdomLand/LocationManagement',
          title: '土地一张图',
          icon: 'zhtd-xdgl',
          id: 472
        },
        {
          path: '/wisdomLand/SitePlanManagement/SiteProjectPlan',
          title: '供地计划管理',
          icon: 'zhtd-gdjhgl',
          id: 473
          // children: [
          //   {
          //     path: '/wisdomLand/SitePlanManagement/SiteProjectPlan',
          //     title: '供地计划管理',
          //     icon: 'zhtd-',
          //     id: 4731
          //   }
          // ]
        },
        {
          path: 'test',
          title: '土地报征管理',
          icon: 'zhtd-tdbzgl',
          id: 474,
          children: [
            {
              path: '/wisdomLand/SiteReportManagement/LandInformation',
              title: '土地信息管理',
              icon: 'zhtd-tdxxgl',
              id: 4741
            },
            {
              path: '/wisdomLand/SiteReportManagement/kanjieData',
              title: '勘界资料管理',
              icon: 'zhtd-kjzlgl',
              id: 4742
            },
            {
              path: '/wisdomLand/SiteReportManagement/collectionBefore',
              title: '征前资料管理',
              icon: 'zhtd-zqzlgl',
              id: 4743
            },
            {
              path: '/wisdomLand/SiteReportManagement/ExamData',
              title: '组卷资料管理',
              icon: 'zhtd-zjzlgl',
              id: 4744
            }
          ]
        },
        // {
        //   path: '/wisdomLand/SiteReportManagement/LandInformation',
        //   title: '土地信息管理',
        //   icon: 'zhtd-'
        // },
        // {
        //   path: '/wisdomLand/SiteReportManagement/kanjieData',
        //   title: '勘界资料管理',
        //   icon: 'zhtd-'
        // },
        // {
        //   path: '/wisdomLand/SiteReportManagement/collectionBefore',
        //   title: '征前资料管理',
        //   icon: 'zhtd-'
        // },
        // {
        //   path: '/wisdomLand/SiteReportManagement/ExamData',
        //   title: '组卷资料管理',
        //   icon: 'zhtd-'
        // },
        {
          path: '/wisdomLand/ManagementDataManagement',
          title: '土地拆迁管理',
          icon: 'zhtd-cqghgl',
          id: 476
        }
      ],
      chidrenShow: true,
      chidrenShowTwo: false
    }
  },
  computed: {
    routerPath() {
      return this.$route.path
    }
  },
  methods: {
    // 路由跳转
    go(path) {
      if (path.indexOf('/wisdomLand') > -1) {
        this.$router.push(path)
        this.chidrenShow = false
      } else if (path === 'rizhi') {
        this.chidrenShowTwo = !this.chidrenShowTwo
      }
    }
  }
}
</script>

<style scoped lang="scss">
.body {
  color: #000;
  height: calc(100vh - 60px);
  width: 100%;
  display: flex;

  &_left {
    width: 296px;
    height: 100%;

    .item {
      width: 100%;
      height: auto;
      text-align: left;
      // padding-left: 22px;
      font-size: 14px;
      font-family: PingFang SC;
      font-weight: 500;
      color: #4c565c;
      line-height: 50px;

      :hover {
        cursor: pointer;
      }
    }

    .activeItem {
      //background: red;
      background: rgba(234, 245, 253, 1);
      border-right: 3px solid #4a80a3;
      color: #497fa3;
      //color: #EAF5FD;
    }
  }

  &_right {
    display: flex;
    width: calc(100% - 296px);
    height: 100%;
    background: #eff3f9;

    .el-card {
      width: 100%;
      margin: 15px;
    }
  }
}
</style>
